
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>微圈详情</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <script src="/jquery/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" href="/css/Comment/ViewComments.css"/>
    <style>

    </style>
</head>
<body>
    <div class="bigBox" >
        <table>
                <tr class="biaoTi">
                    <th>查看微圈信息</th>
                </tr>
                <tr>
                    <th class="neirong nrStyle1">微圈标题：</th>
                    <th class="neirong nrStyle2" id="ArticleTitle">pp</th>
                    <th class="neirong nrStyle1">上传时间：</th>
                    <th class="neirong nrStyle2" id="UploadTime">pp</th>
                    <th class="neirong nrStyle1">上传人：</th>
                    <th class="neirong nrStyle2" id="Uploader">pp</th>
                </tr>
                <tr>
                    <th class="neirong nrStyle1">微圈售价：</th>
                    <th class="neirong nrStyle2" id="ArticlePrice">pp</th>
                    <th class="neirong nrStyle1">微圈搜索关键词：</th>
                    <th class="neirong nrStyle2" id="ArticleSearchKeywords">pp</th>
                    <th class="neirong nrStyle1">微圈点赞量：</th>
                    <th class="neirong nrStyle2" id="ArticlePraise">pp</th>
                </tr>
                <tr>
                    <th class="neirong nrStyle1" >点击量：</th>
                    <th class="neirong nrStyle2" id="Hits">pp</th>
                    <th class="neirong nrStyle1">微圈状态：</th>
                    <th class="neirong nrStyle2" id="ArticleStatus">pp</th>
                    <th class="neirong nrStyle1">微圈分类：</th>
                    <th class="neirong nrStyle2" id="ArticleClassification">pp</th>
                </tr>
                <tr>
                    <th class="neirong nrStyle1" >微圈收藏量：</th>
                    <th class="neirong nrStyle2" id="MicroCircleCollection">pp</th>
                    <th class="neirong nrStyle1">微圈评论量：</th>
                    <th class="neirong nrStyle2" id="MicrocircleComments">pp</th>
                    <th class="neirong nrStyle1">微圈分享数量：</th>
                    <th class="neirong nrStyle2" id="NumberOfMicroCirclesShared">pp</th>
                </tr>
                <tr style="border: 1px solid #BFBFBF">
                    <th class="neirong biaoTiPhoto" ><i class="layui-icon layui-icon-picture"></i>&nbsp;&nbsp;微圈附属图</th>
                </tr>
                <tr style="border: 1px solid #BFBFBF">
                    <th class="neirong preview">预览图：</th>
                    <th class="neirong " ><img src="/images/shangpin.png" id="Preview" class="photo"></th>
                </tr>
                <tr style="border: 1px solid #BFBFBF">
                    <th class="neirong biaoTiPhoto" ><i class="layui-icon layui-icon-chart-screen"></i>&nbsp;&nbsp;微圈内容详情</th>
                </tr>
                <tr style="border: 1px solid #BFBFBF">
                    <th class="neirong previewComments">预览：</th>
                    <th class="neirong content" id="previewpre"></th>
                </tr>
                <tr style="border-bottom:  1px solid #BFBFBF;">
                    <th class="neirong replyToComments" ><i class="layui-icon layui-icon-edit"></i>&nbsp;&nbsp;回复评论及修改内容</th>
                </tr>
        </table>

        <div class="layui-form" style="margin-left: 40px;margin-top: 40px">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名:</label>
                <div class="layui-input-inline">
                    <input type="text" name="userName"  id="userName" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">账号:</label>
                <div class="layui-input-inline">
                    <input type="text" name="account" id="account" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">评论内容:</label>
                <div class="layui-input-inline">
                    <textarea placeholder="请输入内容" class="layui-textarea"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1" onclick="submit()">立即提交</button>
                </div>
            </div>
        </div>
        <div style="border-bottom:  1px solid #BFBFBF;">
            <div class="replyToCommentsTwo" ><i class="layui-icon layui-icon-at"></i>&nbsp;&nbsp;全部评论</div>
        </div>
        <div class="commentContent" id="commentContent" >
            <!--<img id="img" src="" style="width: 55px;height: 55px; background: pink;float: left;border-radius: 50%"/>
            <div class="commentContent2">
                <span id="cousterName">哈哈哈</span>
                <span id="zhangHao">hahahah </span>
                <span id="content"></span>
                <span id="createTime"></span>
                <a href="javascript;"style="color:#008789">隐藏&nbsp;&nbsp;删除</a>
            </div>-->
        </div>

        <p style="margin-top: 10px;font-size: 20px;color: #BFBFBF;text-align: center">没有更多评论了</p>
    </div>
<script>
    var table ;
    layui.use(['form','jquery','table'],function() {
        var form = layui.form;
        var jquery = layui.jquery;
        table = layui.table;


        var PingLun = JSON.parse(localStorage.getItem("PingLun"));
        commodityId = PingLun[0].commodityId;

        var user = JSON.parse(localStorage.getItem("user"));
        var userId = user.userId;
        var trueName = user.trueName;

        if(PingLun[0].details == 2){
            PingLun[0].details = "草稿"
        }else if(PingLun[0].details == 3){
            PingLun[0].details = "已通过"
        }else if(PingLun[0].details == 4){
            PingLun[0].details = "未提交"
        }else if(PingLun[0].details == 5){
            PingLun[0].details = "已提交"
        }else if(PingLun[0].details == 6){
            PingLun[0].details = "退回"
        }

        $("#ArticleTitle").text(PingLun[0].artcleTitle);
        $("#UploadTime").text(PingLun[0].releaseDate);
        $("#Uploader").text(PingLun[0].trueName);
        $("#ArticlePrice").text(PingLun[0].productCurrentprice);
        $("#ArticleSearchKeywords").text(PingLun[0].artcleKeywords);
        $("#ArticleClassification").text(PingLun[0].artcleTitle);
        $("#ArticlePraise").text(PingLun[0].acticleLike);
        $("#Hits").text(PingLun[0].acticleHits);
        $("#Preview").attr("src",PingLun[0].artcleUrl);
        $("#ArticleStatus").text(PingLun[0].details);
        $("#previewpre").text(PingLun[0].article);

        $("#MicroCircleCollection").text(PingLun[0].collectionNum);

        $("#MicrocircleComments").text(PingLun[0].acticleReviews);

        $("#NumberOfMicroCirclesShared").text(PingLun[0].acticleShare);
        $("#userName").val(user.trueName);
        $("#account").val(user.account);

        getAll();
        function getAll() {
            $.ajax({
                url:'/JsComment/getAllCircleComments',
                data:{"commodityId":commodityId,"type":4},
                dataType:'json',
                success:function (data) {
                    var list = data.data;
                    var i = 0;

                    $('textarea').val('');
                    for(i;i<list.length;i++){
                        if(list[i].display == 2 && list[i].status !=3){
                            $('#commentContent').append('<div style="width: 730px;height: 60px;margin-top: 20px">'+'<img id="img" src="'+list[i].acatarUrl+'" style="width: 55px;height: 55px; background: pink;float: left;border-radius: 50%"/>&nbsp;&nbsp;' +
                                '<div class="commentContent2">&nbsp;&nbsp;' +
                                '<span id="cousterName">'+list[i].trueName+'</span>&nbsp;&nbsp;' +
                                '<span id="zhangHao">'+list[i].account+'</span>&nbsp;&nbsp;' +
                                '<span id="content">'+list[i].content+'</span>&nbsp;&nbsp;'+
                                '<span id="createTime">'+list[i].commentDate+'</span>&nbsp;&nbsp;'+
                                '<a onclick="javascript:hideComment('+list[i].id+','+list[i].display+');" style="color:#008789">隐藏</a>&nbsp;&nbsp;'+
                                '<a onclick="javascript:deleComment('+list[i].id+');" style="color:#008789">删除</a>'
                                + '</div>')+'</div>';
                        }else if(list[i].display == 3 && list[i].status != 3){
                            $('#commentContent').append('<div style="width: 730px;height: 60px;margin-top: 20px">'+'<img id="img" src="'+list[i].acatarUrl+'" style="width: 55px;height: 55px; background: pink;float: left;border-radius: 50%"/>&nbsp;&nbsp;' +
                                '<div class="commentContent2">&nbsp;&nbsp;' +
                                '<span id="cousterName">'+list[i].trueName+'</span>&nbsp;&nbsp;' +
                                '<span id="zhangHao">'+list[i].account+'</span>&nbsp;&nbsp;' +
                                '<span id="content">'+list[i].content+'</span>&nbsp;&nbsp;'+
                                '<span id="createTime">'+list[i].commentDate+'</span>&nbsp;&nbsp;'+
                                '<a onclick="javascript:showComment('+list[i].id+','+list[i].display+');" style="color:#008789">显示</a>&nbsp;&nbsp;'+
                                '<a onclick="javascript:deleComment('+list[i].id+');" style="color:#008789">删除</a>'
                                + '</div>')+'</div>';
                        }else if(list[i].status == 3){
                            $('#commentContent').append('<div style="width: 730px;height: 60px;margin-top: 20px">'+'<img id="img" src="'+list[i].acatarUrl+'" style="width: 55px;height: 55px; background: pink;float: left;border-radius: 50%"/>&nbsp;&nbsp;' +
                                '<div class="commentContent2">&nbsp;&nbsp;' +
                                '<span id="cousterName">'+list[i].trueName+'</span>&nbsp;&nbsp;' +
                                '<span id="zhangHao">'+list[i].account+'</span>&nbsp;&nbsp;' +
                                '<span id="content">'+list[i].content+'</span>&nbsp;&nbsp;'+
                                '<span id="createTime">'+list[i].commentDate+'</span>&nbsp;&nbsp;'+
                                '<a onclick="javascript:deleComment('+list[i].id+');" style="color:#008789">已删除</a>'
                                + '</div>')+'</div>';
                        }
                    }
                }
            })
        }

        //隐藏评论
        hideComment = function hideComment(id) {
            $.ajax({
                url:'/JsComment/displayComment',
                data:{"id":id},
                datatype:'json',
                success:function (data) {
                    if(data){
                        layer.msg('隐藏成功');
                    }else{
                        layer.msg("隐藏失败");
                    }
                    window.location.reload()  //刷新页面
                }
            })
        }
        //显示评论
        showComment = function showComment(id) {
            $.ajax({
                url:'/JsComment/showComment',
                data:{"id":id},
                datatype:'json',
                success:function (data) {
                    if(data){
                        layer.msg('显示成功');
                    }else{
                        layer.msg("显示失败");
                    }
                    window.location.reload()  //刷新页面
                }
            })
        }
        //删除评论
        deleComment = function deleComment(id) {
            $.ajax({
                url:'/JsComment/deleComment',
                data:{"id":id},
                datatype:'json',
                success:function (data) {
                    if(data){
                        layer.msg('删除成功');
                    }else{
                        layer.msg("删除失败");
                    }
                    window.location.reload()  //刷新页面
                }
            })
        }

        //提交评论1
        submit = function submit() {

            var userType;
            if(trueName!=undefined){
                userType = 2;
            }else{
                userType = 1;
            }
            var content = $('textarea').val();
            $.ajax({
                url:'/JsComment/referTo',
                data:{"userId":user.userId,"commodityId":commodityId,"type":4,"content":content,"parentId":0,"display":2,"fabulous":12,"status":1,"userType":userType},
                dataType:'json',
                success:function (data) {
                    window.location.reload()  //刷新页面
                }
            })
        }
    });
</script>
</body>
</html>